var Hls = window.Hls
var videobox = document.querySelector('#videobox')
var video = document.querySelector('video')
var btn = document.querySelector('.btn')
var player = document.querySelector('.player')
const content = document.querySelector('.video-content')
// var url = 'http://127.0.0.1:7002/live/movie.m3u8'
var url = 'http://cclive2.aniu.tv/live/anzb.m3u8'
if (Hls.isSupported()) {
  var hls = new Hls()
  hls.loadSource(url)
  hls.attachMedia(video)
  hls.on(Hls.Events.MANIFEST_PARSED, function () {
    // video.play()
  })
} else if (video.canPlayType('application/vnd.apple.mpegurl')) {
  video.src = url
  video.addEventListener('canplay', function () {
    // video.play()
  })
}
btn.addEventListener('click', function () {
  if (video.paused) {
    video.play()
  } else {
    video.pause()
  }
})

content.addEventListener('click', function () {
  if (video.paused) {
    video.play()
  } else {
    video.pause()
  }
})

video.addEventListener('play', function () {
  player.className = 'player'
})

video.addEventListener('pause', function () {
  player.className = 'player pause'
})
// 监听视频盒子的鼠标移入和移出事件(进入需要监听冒泡)
videobox.addEventListener('mouseover', () => {
  // console.log('监听到鼠标移入事件')
  content.style.display = 'block'
})
// 移出不需要监听冒泡要确实离开了最外层的盒子才算移出
videobox.addEventListener('mouseleave', () => {
  // console.log('监听到鼠标移出事件')
  content.style.display = 'none'
})